/*
 * @Author: wangzhongjie
 * @Date: 2020-01-08 09:45:31
 * @LastEditors: wangzhongjie
 * @LastEditTime: 2020-03-05 09:54:12
 * @Description:首页
 * @Email: UvDream@163.com
 */
import React, { useEffect, useState } from "react";
import { Row, Col } from "antd";
import ColorCard from "./card";
import Article from "../../api/article";
import TrendChart from "./trend-chart";
import { version } from "../../config/env";
import "./index.less";
const Dashboard = () => {
  useEffect(() => {
    getList(1, 10);
  }, []);
  const [total, setTotal] = useState();
  const getList = (page, pageSize) => {
    let formData = {
      page: String(page),
      page_size: String(pageSize)
    };
    Article.list(formData).then(res => {
      if (res.code === 200) {
        setTotal(res.data.totalSize);
      }
    });
  };
  return (
    <div className="dashboard">
      <Row gutter={10}>
        <Col xs={24} sm={12} md={12} lg={12} xl={6} xxl={6}>
          <ColorCard
            color={"red"}
            title={"现有文章数量"}
            number={total}
            icon={"folder-open"}
          />
        </Col>
        <Col xs={24} sm={12} md={12} lg={12} xl={6} xxl={6}>
          <ColorCard
            color={"#1890ff"}
            icon={"snippets"}
            title={"版本"}
            number={"V." + version}
          />
        </Col>
        <Col xs={24} sm={12} md={12} lg={12} xl={6} xxl={6}>
          <ColorCard
            color={"#33FFFF"}
            icon={"eye"}
            title={"访问量"}
            number={"200"}
          />
        </Col>
        {/* <Col xs={24} sm={12} md={12} lg={12} xl={6} xxl={6}>
          <ColorCard />
        </Col> */}
      </Row>
      <Row>
        <Col span={24}>
          <TrendChart />
        </Col>
      </Row>
    </div>
  );
};
export default Dashboard;
